{extend name="../public/header" /}
{block name="body"}
<body>
{include file="../public/top" uname="$roleInfo.uname" lv="$roleInfo.ulv" ls="$roleInfo.uyxb" jp="$roleInfo.uczb" /}
<div class="subject main">
    <div class="layui-row">
        <div class="content">
            <div class="current">
                <span class="position">{$roleInfo.map.mname}</span>
                <span class="state">{if $roleInfo.map.ispvp==0}[安全区]{else/}[PVP]{/if}</span>
                <span class="info ajax-map" data-url="{:url('moveMap')}" data-title="世界地图">{$roleInfo.map.world_name}</span>
            </div>
            {if $roleInfo.map.midinfo != ''}
            <div class="describe">{$roleInfo.map.midinfo}</div>
            {/if}
            <div class="monster">
                {volist name='$roleInfo.monster' id='vo' key='k' length='10'}
                <a class="ajax-goto" data-url="{:url('monster/info')}" data-field="id" data-value="{$vo.id}">{$vo.gname}</a>
                {/volist}
            </div>
            <div class="region">
                <div class="layui-row">
                    <div class="layui-col-xs4 layui-col-sm4 layui-col-md4 layui-col-xs-offset4 layui-col-sm-offset4 layui-col-md-offset4">
                        <div class="grid-demo">
                            {if $roleInfo.map.mup == 0}
                            <a class="fontcolor1">没有道路</a>
                            {else/}
                            <a class="ajax-area" data-url="{:url('moveArea')}" data-field="mid" data-value="{$roleInfo.map.mup}">↑{$roleInfo.map.mup_name}</a>
                            {/if}
                        </div>
                    </div>
                </div>
                <div class="layui-row">
                    <div class="layui-col-xs4 layui-col-sm4 layui-col-md4">
                        <div class="grid-demo">
                            {if $roleInfo.map.mleft == 0}
                            <a class="fontcolor1">没有道路</a>
                            {else/}
                            <a class="ajax-area" data-url="{:url('moveArea')}" data-field="mid" data-value="{$roleInfo.map.mleft}">←{$roleInfo.map.mleft_name}</a>
                            {/if}
                        </div>
                    </div>
                    <div class="layui-col-xs4 layui-col-sm4 layui-col-md4 layui-col-xs-offset4 layui-col-sm-offset4 layui-col-md-offset4">
                        <div class="grid-demo">
                            {if $roleInfo.map.mright == 0}
                            <a class="fontcolor1">没有道路</a>
                            {else/}
                            <a class="ajax-area" data-url="{:url('moveArea')}" data-field="mid" data-value="{$roleInfo.map.mright}">{$roleInfo.map.mright_name}→</a>
                            {/if}
                        </div>
                    </div>
                </div>
                <div class="layui-row">
                    <div class="layui-col-xs4 layui-col-sm4 layui-col-md4 layui-col-xs-offset4 layui-col-sm-offset4 layui-col-md-offset4">
                        <div class="grid-demo">
                            {if $roleInfo.map.mdown == 0}
                            <a class="fontcolor1">没有道路</a>
                            {else/}
                            <a class="ajax-area" data-url="{:url('moveArea')}" data-field="mid" data-value="{$roleInfo.map.mdown}">↓{$roleInfo.map.mdown_name}</a>
                            {/if}
                        </div>
                    </div>
                </div>
            </div>
            <div class="npc">
                {volist name='$roleInfo.mnpc_list' id='vo' key='k'}
                <p><a class="ajax-goto" data-url="{:url('npc')}" data-field="id" data-value="{$vo.id}">{$vo.name}</a></p>
                {/volist}
            </div>
            <div class="news">
                <ul class="flow-default" id="LAY_demo"></ul>
            </div>
            <div class="muter">
                <div class="layui-row layui-col-space10 shop">
                    <!-- / -->
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('role/state')}">
                            <div>状态</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('package/myEquip')}">
                            <div>包裹</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('task/index')}">
                            <div>任务</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('pets/index')}">
                            <div>宠物</div>
                        </div>
                    </div>
                    <!-- / -->
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('hone/index')}">
                            <div>境界</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('friends/index')}">
                            <div>关系</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('club/index')}">
                            <div>门派</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('market/index')}">
                            <div>坊市</div>
                        </div>
                    </div>
                    <!-- / -->
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('chat/index')}">
                            <div>聊天</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('ranking/index')}">
                            <div>排行</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto">
                            <div>充值</div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="grid-demo ajax-goto" data-url="{:url('setup/index')}">
                            <div>设置</div>
                        </div>
                    </div>
                    <!-- / -->
                </div>
            </div>
            <div class="labels"></div>
        </div>
    </div>
</div>
</body>
{/block}
{block name="script"}
<script>
    layui.use(['jquery', 'form', 'layajax', 'upload', 'flow', 'element'], function () {
        var $ = layui.jquery
            , layajax = layui.layajax
            , upload = layui.upload
            , element = layui.element
            , flow = layui.flow
            , form = layui.form;

        $('.ajax-map').on('click', function () {
            var obj = $(this);
            var url = obj.data('url');
            var title = obj.data('title');

            layer.open({
                type: 2,
                title: title,
                shadeClose: true, //是否点击遮罩关闭 默认：false
                maxmin: false, //开启最大化最小化按钮 默认：false
                area: ['250px', '250px'],
                content: url,
                btn: ['确定', '取消'],
                yes: function (index, layero) {
                    var n = $(layero).find('iframe')[0];
                    var objb = $(n).contents().find("select[name='mid'] option:selected");
                    var mid = $(objb).val();

                    var map = {};
                    map['mid'] = mid;

                    layer.close(index);
                    $.post("{:url('moveArea')}", map, function (res) {
                        if (res.code == undefined) {
                            console.log('res为json字符串', res);
                            res = JSON.parse(res);
                        } else {
                            console.log('res为json对象', res);
                        }
                        if (res.code == 1) {
                            window.location.href = res.data.url;
                        } else {
                            layer.msg(res.msg);
                        }
                    });
                },
                btn2: function (index, layero) {
                    layer.close(index);
                },
                cancel: function () {
                    //右上角关闭回调
                    return true //开启该代码可禁止点击该按钮关闭
                }
            });
        });

        $('.ajax-area').on('click', function () {
            var obj = $(this);
            var url = obj.data('url');
            var field = obj.data('field');
            var value = obj.data('value');

            console.log('url', url);

            var map = {};
            map[field] = value;

            $.post(url, map, function (res) {
                if (res.code == undefined) {
                    console.log('res为json字符串', res);
                    res = JSON.parse(res);
                } else {
                    console.log('res为json对象', res);
                }
                if (res.code == 1) {
                    window.location.href = res.data.url;
                } else {
                    layer.msg(res.msg);
                }
            });
        });

        flow.load({
            elem: '#LAY_demo' //流加载容器
            , done: function (page, next) { //执行下一页的回调
                var lis = [];

                var map = {};
                map['page'] = page;
                $.post("{:url('getMessage')}", map, function (res) {
                    if (res.code == undefined) {
                        res = JSON.parse(res);
                    }
                    if (res.code == 1) {
                        layui.each(res.data.list, function (index, item) {
                            lis.push('<li>' + item.name + ':' + item.msg + '</li>');
                        });

                        //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
                        //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
                        next(lis.join(''), page < res.data.pages);
                    }
                });
            }
        });

        form.render();
    });
</script>
{/block}
